<!-- 搜索地区 -->
<template lang="">
  <div>
    <div v-for="(item,index) in Info" :key="index" class="div1" @click="clickAction(item)">
      <div class="name">{{item.name}}</div>
      <div class="address">{{item.address}}</div>
    </div>
  </div>
</template>

<script>
  export default {
    name: "LocalCityL",
    data() {
      return {
        localInfo: "",
      }
    },
    props: ['Info'],
    methods: {
      clickAction(item) {
        this.indesInfos.push({ name: item.name, address: item.address, latitude: item.latitude, longitude: item.longitude });
        this.$store.commit('addLocalStorage', this.indesInfos);
        localStorage.setItem("arr", JSON.stringify(this.indesInfos));
        this.axios.get("https://elm.cangdu.org/v2/pois/" + item.latitude + "," + item.longitude).then(((res) => {
          this.localInfo = res.data;
          this.$router.push({ name: 'Swiper', query: { latitude: this.localInfo.latitude, longitude: this.localInfo.longitude } })
        })).catch((err) => {
          console.log(err)
        })
      }
    },
    computed: {
      indesInfos() {
        return this.$store.state.nav.indesInfo;
      }
    },
  }
</script>

<style lang="less" scoped>
  .div1 {
    border-top: 1px solid #ccc;
    padding: 17px 0 10px 20px;
    background-color: white;
  }

  .div1 div:nth-of-type(1) {
    font-size: 16px;
    line-height: 20px;
    color: rgb(100, 100, 100);
  }

  .div1 div:nth-of-type(2) {
    font-size: 12px;
    line-height: 20px;
    color: #999;
    margin-top: 7px;
  }
</style>